<template>
	<!-- 分页组件 -->
	<el-pagination
		v-model:current-page="pageable.pageIndex"
		v-model:page-size="pageable.pageSize"
		:page-sizes="pageable.pageSizes"
		:background="true"
		:layout="layout"
		:total="pageable.total"
		@size-change="handleSizeChange"
		@current-change="handleCurrentChange"
	></el-pagination>
</template>

<script setup lang="ts" name="pagination">
import { Table } from "@/hooks/interface/index";
interface PaginationProps {
	pageable: Table.Pageable;
	handleSizeChange: (size: number) => void;
	handleCurrentChange: (currentPage: number) => void;
	layout: string;
}

withDefaults(defineProps<PaginationProps>(), {
	pageable: () => {
		return { pageIndex: 1, pageSize: 1, total: 0, pageSizes: [10, 25, 50, 100] };
	},
	layout: "total, sizes, prev, pager, next, jumper",
	handleSizeChange: () => {},
	handleCurrentChange: () => {}
});
</script>
